import { Card, message, Row, Col, Space, Divider, Form } from 'antd';
import { history, useRequest, useModel } from 'umi';
import ProForm, {
    ProFormDependency,
    ProFormRadio,
    ProFormSelect,
    ProFormText,
    ProFormTextArea,
    ProFormUploadButton,
    ProFormDatePicker,
    ProFormTimePicker,
    ProFormDateTimePicker
} from '@ant-design/pro-form';
import type { FC } from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import { fakeSubmitForm, queryDetail, jiblist, currentData } from './servic';
import { queryUserVisitors, queryDiseaseTags, queryCaseVisit } from '@/services/ant-design-pro/api';
import RichText from '@/components/RichText';
const BasicForm: FC<Record<string, any>> = () => {
    const { run } = useRequest(fakeSubmitForm, {
        manual: true,
        onSuccess: () => {
            message.success('提交成功');
        },
    });

    // const { data, loading } = useRequest(() => {
    //   if (history.location.query.id) {
    //     return queryDetail(history.location.query);
    //   }
    // });
    const { initialState, setInitialState } = useModel('@@initialState');

    const { currentUser } = initialState;
    const onFinish = async (values: Record<string, any>) => {
        const posy = await currentData({ id: currentUser.id })
        values.addUserType = 1
        values.channel = "130100"
        values.addUserId = posy.data.doctorId
        if (values.upload && values.upload[0].response) {
            values.cover = values.upload[0].response.data.url
        }
        if (history.location.query.id) {
            values.id = history.location.query.id;
            try {
                const response = await fakeSubmitForm(values);
                if (response.code == 200) {
                    message.success('修改成功');
                    history.push('/operations/live');
                } else {
                    message.error('修改失败!' + response.message);
                }
            } catch (error) {
                console.log(error);
            }
        } else {
            const response = await fakeSubmitForm(values);
            if (response.code == 200) {
                message.success('提交成功');
                history.push('/operations/live');
            } else {
                message.error('提交失败!' + response.message);
            }
        }
    };

    const formItemLayout = {
        labelCol: { span: 4 },
        wrapperCol: { span: 14 },
    };

    return (
        <PageContainer content="">
            <Card bordered={false}>
                <ProForm
                    style={{ margin: 'auto', marginTop: 8 }}
                    name="basic"
                    layout="horizontal"
                    // initialValues={data}
                    onFinish={onFinish}
                    {...formItemLayout}
                    request={async () => {
                        if (history.location.query.id) {
                            return queryDetail(history.location.query).then(({ data }) => {
                                if (data.cover) {
                                    data.upload = [
                                        {
                                            uid: '1',
                                            name: 'icon',
                                            status: 'done',
                                            url: 'http://oss.yizuoyiyou.com.cn' + data.cover
                                        },
                                    ];
                                }
                                const diseaseIds = [];
                                for (let i = 0; i < data.diseaseRelationList.length; i++) {
                                  diseaseIds.push(Number(data.diseaseRelationList[i].diseaseId));
                                }
                                data.diseaseIds = diseaseIds;
                                return data;
                            });
                        } else {
                            return {};
                        }
                    }}
                    submitter={{
                        render: (props, doms) => {
                            return (
                                <Row>
                                    <Col span={14} offset={4}>
                                        <Space>{doms}</Space>
                                    </Col>
                                </Row>
                            );
                        },
                    }}
                >
                    <ProFormText
                        width="md"
                        label="标题"
                        name="title"
                        rules={[
                            {
                                required: true,
                                message: '请输入标题',
                            },
                        ]}
                        placeholder="请输入标题"
                    />
                    <ProForm.Item label="文章内容" name="content">
                        <RichText />
                    </ProForm.Item>
                    <ProFormUploadButton
                        name="upload"
                        label="封面"
                        max={1}
                        fieldProps={{
                            name: 'file',
                            listType: 'picture-card',
                        }}
                        action="/api/file/upload"
                        extra="封面将在列表页显示"
                    />
                    <ProFormTextArea name="symptom" label="症状" placeholder="请输入症状" width="md" />
                    <ProFormSelect
                        width="md"
                        name="diseaseIds"
                        label="疾病"
                        fieldProps={{
                            mode: 'multiple',          //多选
                        }}
                        showSearch
                        rules={[
                            {
                                required: true,
                                message: '请选择疾病',
                            },
                        ]}
                        request={async ({ keyWords }) => {
                            const keyWordsTwo = keyWords?keyWords:''
                            const query = {
                                pageNum: 1,
                                pageSize: 100,
                                name: keyWordsTwo
                            };
                            return jiblist(query).then(({ data }) => {
                                return data.list.map((item: any) => {
                                    return {
                                        label: item.name,
                                        value: item.id,
                                    };
                                });
                            });
                        }}
                        extra="请选择和科普文章相关的疾病标签，方便用户查询阅读"
                    />
                    <ProFormTextArea name="treatment" label="治疗" placeholder="请输入治疗" width="md" />
                </ProForm>
            </Card>
        </PageContainer>
    );
};

export default BasicForm;
